import React, { memo } from "react";

import { connect, useSelector, shallowEqual } from "react-redux";

import { decAction, subAction } from "../store/actionCreators";

export default memo(function About(props) {
  const { banners, recommends } = useSelector(
    (state) => ({
      banners: state.banners,
      recommends: state.recommends,
    }),
    shallowEqual
  );

  return (
    <div>
      <hr />
      {/* <h1>About</h1> */}
      {/* <h2>当前计数: {props.count}</h2>
      <button onClick={(e) => props.decrement()}>-1</button>
      <button onClick={(e) => props.subNumber(5)}>-5</button> */}
      <h1>Banner</h1>
      <ul>
        {banners.map((item, index) => {
          return <li key={item.acm}>{item.title}</li>;
        })}
      </ul>
      <h1>Recommend</h1>
      <ul>
        {recommends.map((item, index) => {
          return <li key={item.acm}>{item.title}</li>;
        })}
      </ul>
    </div>
  );
});
